var search = document.querySelector('.search');
var suggestions = document.querySelector('.suggestions')
let x = 1;

search.oninput = function() {
    var value = this.value;
    let url = `http://127.0.0.1:3000/gushi?wd=${value}`
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.send();
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            var data = JSON.parse(xhr.responseText);
            console.log(data)
            setDOM(data)
        }
    }
}

function setDOM(data) {
    var html = '';
    // ES6箭头函数
    // data.forEach(element => {
    //     var str = `<li>
    // <p class="poet">${element.detail_text}</p>
    // <p class="title">${element.title} - ${element.detail_author[0]}(${element.detail_dynasty})</p>
    // </li>`
    //     html += str
    // });

    data.forEach(function(element) {
        var str = `<li>
    <p class="poet">${element.detail_text}</p>
    <p class="title">${element.title} - ${element.detail_author[0]}(${element.detail_dynasty})</p>
    </li>`
        html += str
    });
    suggestions.innerHTML = html

}